import 'package:ducafe_ui_core/ducafe_ui_core.dart';
import 'package:flutter/material.dart';
import 'package:flutter_demo/style/space.dart';
import 'package:flutter_demo/widget/carousel.dart';
import 'package:get/get.dart';
import '../../i18n/locale_keys.dart';
import '../../widget/appbar.dart';
import 'product_details_logic.dart';

class Product_detailsPage extends StatefulWidget {
  const Product_detailsPage({super.key});

  @override
  State<Product_detailsPage> createState() => _Product_detailsPageState();
}

class _Product_detailsPageState extends State<Product_detailsPage> with AutomaticKeepAliveClientMixin {
  // 5 定义 tag 值，唯一即可
  final String tag = '${Get.arguments['id'] ?? ''}${UniqueKey()}';

  @override
  Widget build(BuildContext context) {
    return _ProductDetailsGetx(tag);
  }

  @override
  bool get wantKeepAlive => true;

}


class _ProductDetailsGetx extends GetView<Product_detailsLogic>{
  // 1 定义唯一 tag 变量
  final String uniqueTag;
  //构造方法传入tag
  const _ProductDetailsGetx(this.uniqueTag);

  @override
  String? get tag => uniqueTag;


  @override
  Widget build(BuildContext context) {
     return GetBuilder(builder: (_){
        return  Scaffold(
          resizeToAvoidBottomInset: false,
          // 导航
          appBar: mainAppBarWidget(
              titleString:LocaleKeys.gDetailTitle.tr),
          // 内容
          body: SafeArea(
            child: _buildView(context),
          ),
        );
     },id: "product_details",
     init: Product_detailsLogic(),
     tag: tag,);
  }

  // 主视图
  Widget _buildView(BuildContext context) {
    return <Widget>[
      // 滚动图
      _buildBanner(context),

      // 商品标题
      _buildTitle(context),

      // Tab 栏位
      _buildTabBar(),

      // TabView 视图
      _buildTabView(),
    ].toColumn();
  }



  // 滚动图
  Widget _buildBanner(BuildContext context) {
    return GetBuilder<Product_detailsLogic>(
      builder: (_){
      return CarouselWidget(items: controller.bannerItems,
      onTap: controller.onGalleryTap,
      currentIndex: controller.bannerCurrentIndex,
      onPageChanged: controller.onChangeBanner,
      height: 190.w,
      indicatorCircle: false,
      indicatorAlignment: MainAxisAlignment.start,
      indicatorColor: context.colors.scheme.secondary,
      );
    },id: "product_banner",
      tag: tag,).backgroundColor(context.colors.scheme.surface);
  }

  // 商品标题
  Widget _buildTitle(BuildContext context) {
    return Padding(
      padding: EdgeInsets.all(AppSpace.page),
      child: Column(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        crossAxisAlignment: CrossAxisAlignment.start,
        children: [
          Row(
            children: [
              Expanded(child:
              Text("\$${controller.productModel?.price ?? 0}",style: TextStyle(fontSize: 24,color: context.colors.scheme.onSurface),)
              ),
              Padding(padding: EdgeInsets.only(right: AppSpace.iconTextMedium),child: Row(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisSize: MainAxisSize.max,
                children: [
                  Icon(
                  Icons.star,
                  size: 20,
                  color: context.colors.scheme.primary,),
                  Text("4.5",style: TextStyle(fontSize: 12,color: context.colors.scheme.onSurface.withOpacity(0.8)),)
                ],
              ),),

              Row(
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisSize: MainAxisSize.max,
                children: [
                  Icon(
                    Icons.favorite,
                    size: 20,
                    color: context.colors.scheme.primary,),
                  Text("100+",style: TextStyle(fontSize: 12,color: context.colors.scheme.onSurface.withOpacity(0.8)),)
                ],
              )
            ],
          ),
          Text(controller.productModel?.shortDescription?.clearHtml ?? "-",style: TextStyle(fontSize: 14,color: context.colors.scheme.onSurface),),
        ],
      ),
    );
  }

  // Tab 栏位
  Widget _buildTabBar() {
    return const Text("Tab 栏位");
  }

  // TabView 视图
  Widget _buildTabView() {
    return const Text("TabView 视图");
  }

}
